import React from 'react';
import ReactDOM from 'react-dom';
import {BrowserRouter as Router, Route} from 'react-router-dom'

import {createStore, applyMiddleware} from 'redux'
import {Provider} from 'react-redux'
import reducer from './reducer'
import {createLogger} from 'redux-logger'

import routes from './router'
import './index.css';
import registerServiceWorker from './registerServiceWorker';

const middleware = [];

if (process.env.NODE_ENV === 'development') {
    const logger = createLogger();
    middleware.push(logger);
}

const store = createStore(
    reducer,
    applyMiddleware(...middleware)
);
ReactDOM.render((
    <Provider store={store}>
        <Router>
            <div>
                {
                    routes.map((router, index) => {
                        return <Route key={index} exact={router.exact} path={router.path}
                                      component={router.component}/>
                    })
                }
            </div>
        </Router>
    </Provider>
), document.getElementById('root'));
registerServiceWorker();
